﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>@ViewBag.Title - CONVERSATIONS THAT MATTER - Robert Bosch Engineering and Business Solutions Vietnam Company Ltd</title>
    @Styles.Render("~/Content/css")
    @Scripts.Render("~/bundles/modernizr")
    @Scripts.Render("~/bundles/moment")
    @Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/bundles/jqueryval")
    @Scripts.Render("~/bundles/bootstrap")
    @Scripts.Render("~/bundles/jqueryui")
    @Scripts.Render("~/bundles/typeahead")
    <script src="~/Content/Libraries/rbvh/js/rbvh.js"></script>

    <link href="@Url.Content("~/Content/Libraries/font-awesome-4.4.0/css/font-awesome.css")" rel="stylesheet" />
    <link href="@Url.Content("~/Content/Libraries/timeliner/css/timeliner.css")" rel="stylesheet" />
    <link href="@Url.Content("~/Content/themes/base/all.css")" rel="stylesheet" />
</head>
<body>

    <div class="container body-content">
        @Html.Action("HeaderPartial", "Home")
        @RenderBody()
        <hr />
        <footer class="rbvh-footer">
            <p>&copy; @DateTime.Today.Year - CONVERSATIONS THAT MATTER - Robert Bosch Engineering and Business Solutions Vietnam Company Ltd</p>
        </footer>
    </div>
    
    <script>
    // BEGIN - REMOVE NOTIFICATION
    function removeNotification(id) {
        $.get('@Url.Action("Delete", "Notification")', { id: id }, function (result) {
            if (result.success) {
                $('#notification-' + id).closest('tr').remove();
                var notiPopup = $('#notification-popup')
                var count = parseInt(notiPopup.text()) - 1;
                if (count > 0) {
                    notiPopup.text(count);
                } else {
                    notiPopup.text('');
                }
            }
        });
    }
    // END - REMOVE NOTIFICATION

    $(function () {
        // BEGIN - HANDLE AVATAR ERROR
        $('.user-avatar').on('error', function () {
            this.onerror = null;
            this.src = '@Url.Content("~/Content/Images/GetUserPhoto.png")';
            //this.src = '/Content/Images/GetUserPhoto.png';
        });
        // END - HANDLE AVATAR ERROR

        // BEGIN - CONSTRUCTS THE SUGGESTION ENGINE
        var associates = new Bloodhound({
            datumTokenizer: Bloodhound.tokenizers.whitespace,
            queryTokenizer: Bloodhound.tokenizers.whitespace,
            remote: {
                url: '@Url.Action("SearchAssociates", "Home")' + '?q=%QUERY',
                wildcard: '%QUERY',
            }
        });

        $('#associate-search-box .typeahead').typeahead({
            hint: true,
            highlight: true,
            minLength: 1
        },
        {
            name: 'associates',
            display: 'DisplayName',
            limit: 10,
            source: associates,
            templates: {
                notFound: [
                  '<div class="empty-message">',
                    'unable to find any associate that match the current query',
                  '</div>'
                ].join('\n'),
                suggestion: function (data) { // data is an object as returned by suggestion engine
                    return '<p>' + data.DisplayName + '</p>';
                }
            }
        });

        $('#associate-search-box .typeahead').bind('typeahead:select', function (ev, suggestion) {
            $.post('@Url.Action("SetSelectedUser", "Home")', { id: suggestion.Id },
                function (data) {
                    var url = '@Url.Action("Index", "Home", new { id = "suggestion_id" })';
                    url = url.replace('suggestion_id', suggestion.Id);
                    location.href = url;
                });
        });
        // END - CONSTRUCTS THE SUGGESTION ENGINE
    });
    </script>
    @RenderSection("scripts", required: false)
</body>
</html>